//step0： 定义路由配置表
import Vue from 'vue'
///step1：引入已经下载好的vue-router@3
import VueRouter from 'vue-router'
// vueruter@3 的一个通病  
/* 在创建router实例对象之前，手动覆盖原型链的push来吞掉报错catch */
// 先存储默认底层的push
const originPush = VueRouter.prototype.push
// 覆盖原型链的push
VueRouter.prototype.push = function (location, resolve, reject) {
   // this:路由实例对象

   // 判断用户有没有传后面两个可选参数
    if (resolve || reject) {
        return originPush.call(this, location, resolve, reject)
     } else {// 用户只传了第一个参数
     /* 
        默认底层： catch()方法代码  throw err : 抛出异常
        吞掉报错原理： 重写catch()方法,把默认底层的 throw err给去掉，就不会抛出异常
        */
         return originPush.call(this, location).catch(err => {
             //  throw err
         })
     }
}
Vue.use(VueRouter)

///step3：定义路由规则
const routes = [{
            path: '/',
            redirect: '/home'
        },
        {
            path: '/home',
            name: 'home',
            component: () =>
                import ('@/views/home/HomeIndex.vue'),
            meta: {
                name: 'home',
                isShow: true,
                title: '首页'
            },
            // 搜索 
            children: [{
                path: 'search',
                name: 'search',
                component: () =>
                    import ('@/views/home/search.vue'),
                meta: {
                    name: 'search',
                    isShow: false,
                    title: '搜索页'
                },
            }]
        },
        {
            path: '/channel',
            name: 'channel',
            component: () =>
                import ('@/views/home/channel.vue'),
            meta: {
                name: 'channel',
                isShow: false,
                title: '导航'
            }
        },
        {
            path: '/special',
            name: 'special',
            component: () =>
                import ('@/views/specilaView.vue'),
            meta: {
                name: 'special',
                isShow: true,
                title: '专题'
            }
        },
        {
            path: '/category',
            name: 'category',
            component: () =>
                import ('@/views/categoryView.vue'),
            meta: {
                name: 'category',
                isShow: true,
                title: '分类'
            }
        },
        {
            path: '/cart',
            name: 'cart',
            component: () =>
                import ('@/views/cart/cart.vue'),
            meta: {
                name: 'cart',
                isShow: true,
                title: '购物车'
            }
        },
        {
            path: '/mine',
            name: 'mine',
            component: () =>
                import ('@/views/mine.vue'),
            meta: {
                name: 'mine',
                isShow: true,
                title: '我的'
            }
        },
        {
            path: '/productDecital',
            name: 'productDecital',
            component: () =>
                import ('@/views/product/productDetial.vue'),
            meta: {
                name: 'productDecital',
                isShow: false,
                title: '商品详情'
            }
        },

    ]
    // /step4：创建路由对象
const router = new VueRouter({
        routes,
        mode: 'history'
    })
    //设置全局前置守卫
    // 判将要跳转到购物车页面时，是否登录，
    // 如果登录了就可以放行跳转到购物车页面，否则提示请先登录，然后跳转到我的页面
    // 如是除购物车以外的其他页面，则直接放行跳转到对应页面
router.beforeEach((to, from, next) => {
        let token = localStorage.getItem('token')
        if (to.path == '/cart') {
            if (token) {
                next()
            } else {
                Vue.prototype.$toast('请先登录');
                // 定时器
                setTimeout(() => {
                    next("/mine");
                }, 1000);
            }
        } else {
            next()
        }

    })
    // 全局后置钩子，实现不同页面显示不同标题
router.afterEach((to, from) => {
        document.title = to.meta.title
    })
    // step5:抛出路由对象
export default router